
// import productTopItemStyle from "@Styles/productTopItemStyle.scss?inline"
import {
    Button,
    message
} from "@bytedance/mona-ui"
import type {
    PlasmoCSConfig,
    PlasmoGetInlineAnchor,
    PlasmoGetStyle,
    PlasmoMountShadowHost
} from "plasmo"
import React, { useState } from "react"
import { Provider } from "react-redux"

import { PersistGate } from "@plasmohq/redux-persist/integration/react"

import { persistor, store, useAppDispatch, useAppSelector } from "~store"


// setactivityToolType

// export const getStyle: PlasmoGetStyle = () => {
//   const style = document.createElement("style")
//   style.textContent = productTopItemStyle
//   return style
// }

export const config: PlasmoCSConfig = {
    matches: ["https://offer-new.1688.com/*"]
}

export const getInlineAnchor: PlasmoGetInlineAnchor = async () => {
    return document.querySelector('.module-cbu-picture').querySelector('[style="display: flex;"]') as HTMLElement
}
// export const getInlineAnchorList: any = async () => {
//   const urls = location.pathname === "/ffa/morder/order/list"
//   if (!urls) return
//   const detailList = document.querySelectorAll('[style*="display: flex; flex-direction: column; align-items: center"]')
//   return detailList

// }
// export const mountShadowHost: PlasmoMountShadowHost = ({
//   shadowHost,
//   anchor,
//   mountState
// }) => {
//   // const addchi = document.querySelector('[class*="index_batch"]')
//   // addchi && anchor?.element?.insertBefore(shadowHost, addchi.nextSibling)
//   // anchor?.element.insertBefore(shadowHost, anchor.element.children[0])
//   anchor?.element.appendChild(shadowHost)

//   mountState?.observer?.disconnect()
// }

// export const getShadowHostId = () => "product-top-item-id"

const TaberTopBut = () => {
    // console.log('可以加载组建')
    // window.addEventListener('message', (e) => {
    //     console.log('收到消息', e.data)
    // })
    setInterval(() => {
        const dialog = document.querySelector('.ui-dialog')
        if (dialog) {
            dialog.style.top = 0
            dialog.style.left = 0
            dialog.style.width = '100vw'
            dialog.style.height = '100vh'
        }
        const ipd = document.querySelector('.ibank-picker-dialog')
        if (ipd) {
            ipd.style.width = "100vw"
            ipd.style.height = "100vh"
        }
        const ipdC = document.querySelector('.picker-content')
        if (ipdC) {
            ipdC.style.width = "100%"
            ipdC.style.setProperty('height', "100vh", 'important')
            // ipdC.style.height = "100vh !important"
            // 删除class

        }
        const iframea = document.querySelector('.picker-frame')
        if (iframea) {
            iframea.style.width = "100%"
            iframea.style.height = "90%"
        }
    }, 100)
    return (
        <Button style={{
            marginLeft: 10
        }} onClick={() => {
            document.querySelector('.module-picture-cover-wrapper').click()


            // openSelectFile()

        }}></Button>
    )
}

const PlasmoInline = () => {
    return (
        <Provider store={store}>
            <PersistGate loading={null} persistor={persistor}>
                <TaberTopBut />
            </PersistGate>
        </Provider>
    )
}

export default PlasmoInline
